<template>
  <div>
    <n-card title="商家信息">
      <n-grid cols="1 400:2 700:3">
        <n-gi>
          <n-form-item label="商户名">
            <n-input
              v-model:value="merchantInfo.acctName"
              placeholder="暂无数据"
              style="width: 80%"
              readonly
              size="medium"
              disabled
            />
          </n-form-item>
        </n-gi>
        <n-gi>
          <n-form-item label="注册时间">
            <n-input
              v-model:value="merchantInfo.createdTime"
              placeholder="暂无数据"
              style="width: 80%"
              readonly
              size="medium"
              disabled
            />
          </n-form-item>
        </n-gi>
        <n-gi>
          <n-form-item label="商户号">
            <n-input
              v-model:value="merchantInfo.custNo"
              placeholder="暂无数据"
              style="width: 80%"
              readonly
              size="medium"
              disabled
            />
          </n-form-item>
        </n-gi>
        <n-gi>
          <n-form-item label="商户号名称">
            <n-input
              v-model:value="merchantInfo.custName"
              placeholder="暂无数据"
              style="width: 80%"
              readonly
              size="medium"
              disabled
            />
          </n-form-item>
        </n-gi>
        <n-gi>
          <n-form-item label="商户状态">
            <n-radio :checked="merchantInfo.custStatus === '0'" value="正常" readonly>
              正常
            </n-radio>
            <n-radio :checked="merchantInfo.custStatus === '1'" value="冻结" readonly>
              冻结
            </n-radio>
            <n-radio :checked="merchantInfo.custStatus === '3'" value="未激活" readonly>
              未激活
            </n-radio>
          </n-form-item>
        </n-gi>
        <n-gi>
          <n-form-item label="联系人">
            <n-input
              v-model:value="merchantInfo.contactPerson"
              placeholder="暂无数据"
              style="width: 80%"
              readonly
              size="medium"
              disabled
            />
          </n-form-item>
        </n-gi>
          <n-gi>
          <n-form-item label="电话">
            <n-input
              v-model:value="merchantInfo.tel"
              placeholder="暂无数据"
              style="width: 80%"
              readonly
              size="medium"
              disabled
            />
          </n-form-item>
        </n-gi>
        <n-gi>
          <n-form-item label="地址">
            <n-input
              v-model:value="merchantInfo.address"
              placeholder="暂无数据"
              style="width: 80%"
              readonly
              size="medium"
              disabled
            />
          </n-form-item>
        </n-gi>
        <n-gi>
          <n-form-item label="信息变更时间">
            <n-input
              v-model:value="merchantInfo.updatedTime"
              placeholder="暂无数据"
              style="width: 80%"
              readonly
              size="medium"
              disabled
            />
          </n-form-item>
        </n-gi>
        <n-gi>
          <n-form-item label="邮箱">
            <n-input
              v-model:value="merchantInfo.email"
              placeholder="暂无数据"
              style="width: 80%"
              readonly
              size="medium"
              disabled
            />
          </n-form-item>
        </n-gi>
      </n-grid>
    </n-card>
    <n-card title="账号信息">
      <n-grid cols="1 400:2 700:3">
        <n-gi>
          <n-form-item label="账号">
            <n-input
              v-model:value="merchantInfo.acctNo"
              placeholder="暂无数据"
              style="width: 80%"
              readonly
              size="medium"
              disabled
            />
          </n-form-item>
        </n-gi>
        <n-gi>
          <n-form-item label="户名">
            <n-input
              v-model:value="merchantInfo.acctName"
              placeholder="暂无数据"
              style="width: 80%"
              readonly
              size="medium"
              disabled
            />
          </n-form-item>
        </n-gi>
        <n-gi>
          <n-form-item label="开户时间">
            <n-input
              v-model:value="merchantInfo.openAcctDate"
              placeholder="暂无数据"
              style="width: 80%"
              readonly
              size="medium"
              disabled
            />
          </n-form-item>
        </n-gi>
        <n-gi>
          <n-form-item label="账户状态">
            <n-radio :checked="merchantInfo.acctStatus === '0'" value="正常" readonly>
              正常
            </n-radio>
            <n-radio :checked="merchantInfo.acctStatus === '1'" value="未激活" readonly>
              未激活
            </n-radio>
            <n-radio :checked="merchantInfo.acctStatus === '3'" value="冻结" readonly>
              冻结
            </n-radio>
          </n-form-item>
        </n-gi>
        <n-gi>
          <n-form-item label="余额">
            <n-input
              v-model:value="merchantInfo.balance"
              placeholder="暂无数据"
              style="width: 80%"
              readonly
              size="medium"
              disabled
            />
          </n-form-item>
        </n-gi>
          <n-gi>
          <n-form-item label="链钱包地址">
            <n-input
              v-model:value="merchantInfo.walletAddress"
              placeholder="暂无数据"
              style="width: 80%"
              readonly
              size="medium"
              disabled
            />
          </n-form-item>
        </n-gi>
          <n-gi>
          <n-form-item label="链钱包余额">
            <n-input
              v-model:value="merchantInfo.walletAmt"
              placeholder="暂无数据"
              style="width: 80%"
              readonly
              size="medium"
              disabled
            />
          </n-form-item>
        </n-gi>
        <n-gi>
          <n-form-item> </n-form-item>
        </n-gi>
      </n-grid>
    </n-card>
  </div>
</template>
<script lang="ts" setup>
import { getMerchantInfo } from '@/api/setting/getMerchantInfo';
import { ref, onMounted } from 'vue';
import { useMessage } from 'naive-ui';
import { createStorage } from '@/utils/Storage';
import formatDate from '@/utils/timestamp';

const Storage = createStorage({ storage: localStorage });
const model_forget = ref(false);
const screenWidth = true;
const message = useMessage();
const formRef = ref(null);

// 商户信息响应式
const merchantInfo = ref({
  acctStatus: '',
  createdTime: '',
  custNo: '',
  custName: '',
  // bizCategory: '',
  contactPerson: '',
  tel: '',
  // legalPerson: '',
  address: '',
  updatedTime: '',
  acctNo: '',
  acctName: '',
  openAcctDate: '',
  balance: '',
  email: '',
  custStatus: '',
  walletAddress:'',
  walletAmt:''
});

// 获取商户信息
onMounted(async () => {
  let custNo = Storage.get('custNo');
  const merchantInfoList = await getMerchantInfo({ custNo });
  console.log(merchantInfoList);
  merchantInfo.value = merchantInfoList.data.body;
  merchantInfoList.data.body.forEach((val) => {
    val.updatedTime = formatDate(new Date(val.updatedTime));
    val.openAcctDate = formatDate(new Date(val.openAcctDate));
    // 商户状态
    if (val.custStatus == '0') {
      val.custStatus = '正常';
    } else if (val.custStatus == '1') {
      val.custStatus = '注销';
    } else if (val.custStatus == '2') {
      val.custStatus = '冻结';
    } else {
      val.custStatus = '未激活';
    }
    // 账户状态
    if (val.acctStatus == '0') {
      val.acctStatus = '正常';
    } else if (val.acctStatus == '1') {
      val.acctStatus = '未激活';
    } else if (val.acctStatus == '2') {
      val.acctStatus = '挂失';
    } else if (val.acctStatus == '3') {
      val.acctStatus = '冻结';
    } else {
      val.acctStatus = '销户';
    }
  });
});

// 判断账号状态
</script>
<style>
.n-card-header__main {
  margin-left: -6px;
}
.n-form-item-label {
  padding: 0 !important;
}
.n-card__content {
  padding-top: 0 !important;
}
.n-card-header {
  padding-bottom: 10px !important;
}
</style>